<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>家庭谱</title>
    <link rel="stylesheet" href="font-family/iconfont.css">
    <link rel="stylesheet" href="../css/app-jpshow/jpshow_style.css">
    <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
    <script src="js/jpshow.js"></script>
</head>
<body>
    <div>
        <div class="weui-navbar bg_white jp-navbar">
            <div class="weui-navbar__item weui-bar__item_on">
                <i class="icon iconfont icon-form fa-hx"></i> <br/>
                家庭谱
            </div>
            <div class="weui-navbar__item">
                <i class="icon iconfont icon-evaluate fa-hx"></i> <br/>
                家谱秀
            </div>
            <div class="weui-navbar__item">
                <i class="icon iconfont icon-piclight fa-hx"></i> <br/>
                模板库
            </div>
        </div>
        <div class="weui-search-bar jp-search-bar" id="searchBar">
            <form class="weui-search-bar__form">
                <div class="weui-search-bar__box">
                    <i class="weui-icon-search"></i>
                    <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
                    <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
                </div>
                <label class="weui-search-bar__label" id="searchText">
                    <i class="weui-icon-search"></i>
                    <span>搜索家庭谱</span>
                </label>
            </form>
            <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
        </div>
        <div class="bg_white">
            <div class="p-lr family-book-click-item">
                <div class="bbs p-tb">
                    <div class="media">
                        <div class="media-left">
                            <img src="images/zupu.png" alt="" width="120">
                        </div>
                        <div class="media-right">
                            <h3 class="text_oneline fwn">长沙张氏十修族谱</h3>
                            <div class="m-t text_dark">
                                <p>人数：3952人</p>
                                <p class="m-t-xs">照片：45张</p>
                                <p class="m-t-xs">浏览：3443次</p>
                            </div>
                            <div class="jp-btn-group">
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default btn-theme">
                                    <i class="icon iconfont icon-cart"></i>
                                    <span class="visible-xs t-2">纸质谱</span>
                                </a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default">
                                    <i class="icon iconfont icon-edit"></i>
                                    <span class="visible-xs t-2">编辑</span>
                                </a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default">
                                    <i class="icon iconfont icon-share"></i>
                                    <span class="visible-xs t-2">分享</span>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="p-lr family-book-click-item">

                <div class="bbs p-tb">
                    <div class="media">
                        <div class="media-left">
                            <img src="images/zupu.png" alt="" width="120">
                        </div>
                        <div class="media-right">
                            <h3 class="text_oneline fwn">长沙张氏十修族谱</h3>
                            <div class="m-t text_dark">
                                <p>人数：3952人</p>
                                <p class="m-t-xs">照片：45张</p>
                                <p class="m-t-xs">浏览：3443次</p>
                            </div>
                            <div class="jp-btn-group">
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default btn-theme"><i class="icon iconfont icon-cart"></i> <span class="visible-xs">纸质谱</span></a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"><i class="icon iconfont icon-edit"></i> <span class="visible-xs">编辑</span></a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"><i class="icon iconfont icon-share"></i> <span class="visible-xs">分享</span></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="p-lr family-book-click-item">

                <div class="bbs p-tb">
                    <div class="media">
                        <div class="media-left">
                            <img src="images/zupu.png" alt="" width="120">
                        </div>
                        <div class="media-right">
                            <h3 class="text_oneline fwn">长沙张氏十修族谱</h3>
                            <div class="m-t text_dark">
                                <p>人数：3952人</p>
                                <p class="m-t-xs">照片：45张</p>
                                <p class="m-t-xs">浏览：3443次</p>
                            </div>
                            <div class="jp-btn-group">
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default btn-theme"><i class="icon iconfont icon-cart"></i> <span class="visible-xs">纸质谱</span></a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"><i class="icon iconfont icon-edit"></i> <span class="visible-xs">编辑</span></a>
                                <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default"><i class="icon iconfont icon-share"></i> <span class="visible-xs">分享</span></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>